<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" import="java.util.*,hotel.entity.*"%>
<%@include file="../link.html"%>
<script type="text/javascript">
layui.use('form', function(){
	var form = layui.form;
	form.render();
	var needAmount=${amount};
	var selectedAmount=0;
	//监听CheckBox
	form.on('checkbox', function(data){
		  if(data.elem.checked)
			  ++selectedAmount;
		  else
			  --selectedAmount;
		  $('#selectedAmount').html(selectedAmount);
		  if(selectedAmount==needAmount)
			  $('#btn-confirm').attr("class","btn btn-success");
		  else
			  $('#btn-confirm').attr("class","btn btn-success disabled");
	});
});

function confirm(){
	var index=$('#btn-confirm').attr('class').indexOf("disabled");
	if(index==-1){
		var id="";//房间主键
		var number="";//房间编号
		$("input[name='roomNumber']:checked").each(function(i){
			id+=","+this.id;
			number+=", "+this.value;
		});
		
		$("#roomNumbers" , parent.document).val(number.substring(2));//设置父页面的选择房间input的值
		$("input[name='roomids']" , parent.document).val(id.substring(1));//设置父页面实际提交的房间id
		var index = parent.layer.getFrameIndex(window.name);
		parent.layer.close(index);
	}
}

</script>

<form class="layui-form" style="padding-top:25px;" action="#">
	<div class="layui-form-item">
		<label class="col-sm-offset-1 col-sm-3 control-label">
			当前房间类型:${category.categoryName}
		</label>
	</div>
	<div class="layui-form-item">
		<label class="col-sm-offset-1 col-sm-5 control-label">
			需要选择房间数量: <span style="color:green">${amount}间</span>&nbsp;&nbsp;&nbsp;&nbsp;当前已选: <span id="selectedAmount"></span>间
		</label>
	</div>
	
	<div class="layui-form-item">
		<%
		List<Room> roomList=(List<Room>)request.getAttribute("roomList");
		Map<Integer,Room> available=(Map<Integer,Room>)request.getAttribute("availableMap");
		for(Room r:roomList){
			if(available.containsKey(r.getRoomid()))
				out.print("<div class='col-sm-4'><div class='layui-input-block'>"
					+"<input type='checkbox' value='"+r.getNo()+"' name='roomNumber' id='"
					+r.getRoomid()+"' title='"+r.getNo()+"'></div></div>");
			else
				out.print("<div class='col-sm-4'><div class='layui-input-block'>"
					+"<input type='checkbox' value='"+r.getNo()+"' name='roomNumber' id='"
					+r.getRoomid()+"' title='"+r.getNo()+"' disabled></div></div>");
		}
		%>
	</div>
	
	<div class="box-footer"></div>
	
	<div class="layui-form-item">
		<label class="col-sm-9 control-label"></label>
		<div class="col-sm-2 pull-right">
			<button id="btn-confirm" type="button" class="btn btn-success disabled" onClick="confirm()">
				<i class="fa fa-check"></i> 确定
			</button>
		</div>
	</div>
</form>